import moment from "moment"
import { useEffect, useState } from "react"
import { useDispatch, useSelector } from "react-redux"
import TitleCard from "../../../components/Cards/TitleCard"
import { showNotification } from '../../common/headerSlice'
import InputText from '../../../components/Input/InputText'
import TextAreaInput from '../../../components/Input/TextAreaInput'
import ToogleInput from '../../../components/Input/ToogleInput'
import CommonService from "../../../app/services/commonService"
import CompanyAccountService from "../../../app/services/companyAccountService"
import { clearUserInfo } from "../../../app/store/userinfoSlice"
import CryptHelper from "../../../utils/encrypted"

function ProfileSettings(){


    const dispatch = useDispatch()

    const [updatePassword, setUpdatePassword] = useState({
        oldPassword : "",
        newPassword : "",
        confirmPassword : ""
    })

    const updateFormValue = ({updateType, value}) => {
        setUpdatePassword({...updatePassword, [updateType] : value})
    }

    const updatePasswordAction = () => {
        CommonService.setLoading(true)
        if(updatePassword.oldPassword === "" || updatePassword.newPassword === "" || updatePassword.confirmPassword === "") {
            dispatch(showNotification({message : "密码不能为空", status : 0}))
            CommonService.setLoading(false)
            return
        }

        if(updatePassword.oldPassword.length < 6 || updatePassword.newPassword.length < 6 || updatePassword.oldPassword.length > 12 || updatePassword.newPassword.length > 12 ) {
            dispatch(showNotification({message : "密码长度在6~12位之间", status : 0}))
            CommonService.setLoading(false)
            return
        }


        if(updatePassword.newPassword !== updatePassword.confirmPassword){
            dispatch(showNotification({message : "新密码与确认密码不一致", status : 0}))
            CommonService.setLoading(false)
            return
        }

        var params = {
            oldPassword : CryptHelper.encryptWithMd5(updatePassword.oldPassword),
            newPassword : CryptHelper.encryptWithMd5(updatePassword.newPassword)
        }

        CompanyAccountService.resetPassword(params).then((res) => {
            if(res.success){
                dispatch(showNotification({message : "更新密码成功", status : 1}))
                localStorage.clear();
                dispatch(clearUserInfo({}))
                window.location.href = '/'
            } else {
                dispatch(showNotification({message : res.msg, status : 0}))
            }
        }).finally(() => {
            CommonService.setLoading(false)
        })
    }

    return(
        <>
            
            <TitleCard title="修改密码" topMargin="mt-4">

                <div className="flex flex-col items-center justify-center px-2">
                    <InputText labelTitle="原密码" type='password' updateType='oldPassword' defaultValue="" containerStyle="w-64" updateFormValue={updateFormValue}/>
                    <InputText labelTitle="新密码" type='password' updateType='newPassword' defaultValue="" containerStyle="w-64" updateFormValue={updateFormValue}/>
                    <InputText labelTitle="确认密码" type='password' updateType='confirmPassword' defaultValue="" containerStyle="w-64" updateFormValue={updateFormValue}/>
                </div>

                <div className="mt-16"><button className="btn btn-primary float-right" onClick={() => updatePasswordAction()}>修改密码</button></div>
            </TitleCard>
        </>
    )
}


export default ProfileSettings